<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>奸笑表情</title>
	</head>
	<style>
		.橙脸{width: 300px;
		height: 300px;
		background-color: #ffaa00;
		border-radius: 50%;
		
			
		}
		.左眼框{
			width: 80px;
			height: 30px;
			background-color: #ffffff;
			border-radius: 20px;
			position: relative;
			left: 33px;
			top: 57px;
			
		}
		.右眼框{
			width: 80px;
			height: 30px;
			background-color: #ffffff;
			border-radius: 20px;
			position: relative;
			left: 157px;
			top: 2px;
			}
		.左眼{
			width: 30px;
			height: 30px;
			background-color: #000000;
			border-radius: 50%;
			position: relative;
			left: -157px;
			top: -2px;
			
			
			
			
		}	
		.右眼{
			width: 30px;
			height: 30px;
			background-color: #000000;
			border-radius: 50%;
			position: relative;
			left: -1px;
			top: -30px;
				}
			.左脸晕{width: 60px;
			          height: 60px;
			          border-radius: 50%;
			          background-color: #ffaaff;
			          position:relative;
			          left: -175px;
			          top: 7px;}
			.右脸晕{width: 60px;
			          height: 60px;
			          border-radius: 50%;
			          background-color: #ffaaff;
			          position:relative;
			          left: 209px;
					  top: 0px;}
			.嘴角{
			        width: 200px;
			        height:100px;
			        border-bottom: 5px solid black;
			        border-radius: 0 0 100px 100px;
			         position:absolute;
			        left:52px;
			        top: 180px; 
					  }    
			       
			            
	</style>
	<body>
		<div class="橙脸">
			<div class="左眼框">
				<div class="右眼框">
					<div class="左眼"></div>
					<div class="右眼"></div>
					<div class="左脸晕">
						<div class="右脸晕"></div>
					</div>
				</div>
			</div>

			<div class="嘴角"></div>
		<p></p>
	</body>
</html>